import { Tooltip } from 'antd';
import pageStyles from '@/common/pageLayout.less';
import { getColorTextLoadMap } from '@/utils';

const contactsTableColumns: Record<string, any>[] = [
  {
    title: '姓名',
    dataIndex: 'fullName',
    key: 'fullName',
    width: 110,
    visible: true,
    fixed: 'left',
    unDrag: true,
    sorter: (a: any, b: any) => (a?.fullName < b?.fullName ? -1 : 1),
    render: (text: string | null, record: any) => {
      return (
        <Tooltip title={text ? text?.split('-')?.[0] : ''}>
          <span className={pageStyles['over-flow-hidden']} style={{ maxWidth: 120 }}>
            {text ? text?.split('-')?.[0] : '--'}
          </span>
        </Tooltip>
      );
    },
  },
  {
    title: '性别',
    dataIndex: 'sex',
    key: 'sex',
    width: 70,
    visible: true,
    sorter: (a: any, b: any) => (a?.sex < b?.sex ? -1 : 1),
    render: (text: string | null, record: any) => {
      let sexText = <>--</>;
      if (text == '0') {
        sexText = <span style={{ color: '#faad14' }}>未知</span>;
      } else if (text == '1') {
        sexText = <span style={{ color: '#096dd9' }}>男</span>;
      } else if (text == '2') {
        sexText = <span style={{ color: '#fd018b' }}>女</span>;
      }
      return (
        <Tooltip title={text ? text?.split('-')?.[0] : ''}>
          <span className={pageStyles['over-flow-hidden']} style={{ maxWidth: 120 }}>
            {sexText}
          </span>
        </Tooltip>
      );
    },
  },
  {
    title: '手机号码',
    dataIndex: 'phoneMobile',
    key: 'phoneMobile',
    width: 130,
    visible: true,
    sorter: (a: any, b: any) => (a?.phoneMobile < b?.phoneMobile ? -1 : 1),
    render: (text: string | null) => {
      return (
        <span className={pageStyles['over-flow-hidden']} style={{ maxWidth: 110 }}>
          {text ? text : '--'}
        </span>
      );
    },
  },
  {
    title: '办公电话',
    dataIndex: 'phoneOffice',
    key: 'phoneOffice',
    width: 150,
    visible: true,
    sorter: (a: any, b: any) => (a?.phoneOffice < b?.phoneOffice ? -1 : 1),
    render: (text: string | null) => {
      return (
        <Tooltip title={text}>
          <span className={pageStyles['over-flow-hidden']} style={{ maxWidth: 130 }}>
            {text ? text : '--'}
          </span>
        </Tooltip>
      );
    },
  },
  {
    title: '备用手机',
    dataIndex: 'phoneSpare',
    key: 'phoneSpare',
    width: 150,
    visible: false,
    sorter: (a: any, b: any) => (a?.phoneSpare < b?.phoneSpare ? -1 : 1),
    render: (text: string | null) => {
      return (
        <Tooltip title={text}>
          <span className={pageStyles['over-flow-hidden']} style={{ maxWidth: 130 }}>
            {text ? text : '--'}
          </span>
        </Tooltip>
      );
    },
  },
  {
    title: '邮箱编号',
    dataIndex: 'emailNum',
    key: 'emailNum',
    width: 150,
    visible: true,
    render: (text: string | null) => {
      return (
        <Tooltip title={text}>
          <span className={pageStyles['over-flow-hidden']} style={{ maxWidth: 130 }}>
            {text ? text : '--'}
          </span>
        </Tooltip>
      );
    },
  },
  {
    title: '所在公司',
    dataIndex: 'companyName',
    key: 'companyName',
    width: 200,
    visible: true,
    sorter: (a: any, b: any) => (a?.companyName < b?.companyName ? -1 : 1),
    render: (text: string | null) => {
      return (
        <Tooltip title={text}>
          <span className={pageStyles['over-flow-hidden']} style={{ maxWidth: 190 }}>
            {text ? text : '--'}
          </span>
        </Tooltip>
      );
    },
  },
  {
    title: '所在部门',
    dataIndex: 'deptName',
    key: 'deptName',
    width: 150,
    visible: true,
    sorter: (a: any, b: any) => (a?.deptName < b?.deptName ? -1 : 1),
    render: (text: string | null) => {
      return (
        <Tooltip title={text}>
          <span className={pageStyles['over-flow-hidden']} style={{ maxWidth: 130 }}>
            {text ? text : '--'}
          </span>
        </Tooltip>
      );
    },
  },
  {
    title: '当前职务',
    dataIndex: 'positionName',
    key: 'positionName',
    width: 150,
    visible: true,
    sorter: (a: any, b: any) => (a?.positionName < b?.positionName ? -1 : 1),
    render: (text: string | null) => {
      return (
        <Tooltip title={text}>
          <span className={pageStyles['over-flow-hidden']} style={{ maxWidth: 130 }}>
            {text ? text : '--'}
          </span>
        </Tooltip>
      );
    },
  },
  {
    title: '所在区域',
    dataIndex: 'provinceCode',
    key: 'provinceCode',
    width: 150,
    visible: true,
    render: (text: string, record: Record<string, any>) => {
      let newText =
        (record.provinceCodeName ? record.provinceCodeName : '') +
        (record.cityCodeName ? `/${record.cityCodeName}` : '') +
        (record.countyCodeName ? `/${record.countyCodeName}` : '');
      return (
        <Tooltip title={newText ? newText : ''}>
          <span className={pageStyles['over-flow-hidden']} style={{ maxWidth: 130 }}>
            {newText ? newText : '--'}
          </span>
        </Tooltip>
      );
    },
  },
  {
    title: '最高学历',
    dataIndex: 'educateLevelName',
    key: 'educateLevelName',
    width: 150,
    visible: true,
    sorter: (a: any, b: any) => (a?.educateLevel < b?.educateLevel ? -1 : 1),
    render: (text: string) => {
      const { color, colorText } = getColorTextLoadMap(text);
      return (
        <Tooltip title={colorText}>
          <span className={pageStyles['over-flow-hidden']} style={{ maxWidth: 140, color }}>
            {colorText ? colorText : '--'}
          </span>
        </Tooltip>
      );
    },
  },
];

export { contactsTableColumns };
